<!doctype html>
<html>

<head>
	<meta charset="utf-8">
	<title>无标题文档</title>
	<link href="/static/css/default.css" rel="stylesheet" type="text/css">
	<link href="/static/css/style/green.css" rel="stylesheet" type="text/css" id='link'>
	<link href="/static/js/datepicker/css/bootstrap-datepicker.css" rel="stylesheet">
</head>

<body style="padding:15px 8px 0px 8px;">



	<div class="classify">{$parenttitle}</div>

	<ul class="toolbar">
		<li>开始日期: <input type="text" style="width:120px;" class="forminput inputstyle" onfocus="WdatePicker()"
				id="date1" value="{$date1}"></li>
		<li>结束日期: <input type="text" style="width:120px;" class="forminput inputstyle" onfocus="WdatePicker()"
				id="date2" value="{$date2}"></li>
		<li>学号：<input type="text" style="width:120px;" class="forminput inputstyle" id="number" value="{$number}"></li>
		<li>姓名<input type="text" style="width:120px;" class="forminput inputstyle" id="truename" value="{$truename}">
		</li>
		<li>班级

			<select type="text" id="classid" class="select" v-model="classid">
				<option value="">
					请选择
				</option>
				<option v-for="item in list" :value='item.id'>
					{{item.classname}}
				</option>
			</select>
		</li>
		<li><a href="#" class="selected" id="search">查询</a></li>
		<li><a href="#" class="selected" id="clear">重置</a></li>

	</ul>
	<div class="tablebox" id="main">

		<table>

			<thead>
				<th class="num"></th>
				<th>学生姓名</th>
				<th>签到时间</th>
				<th>签到方式</th>
				<th>签到人</th>
				<th>班级</th>

			</thead>

			<tbody>


				<tr v-for="uitem in arrayData">
					<td><input type="checkbox"></td>

					<td>{{uitem.studentname}}</td>
					<td>{{uitem.signdate}}</td>
					<td>{{uitem.type}}</td>
					<td>{{uitem.teachername}}</td>
					<td>{{uitem.classname}}</td>


				</tr>
				</tr>



			</tbody>

		</table>

		<div class="pagination">

			<!-- <li><a href="#">尾页</a></li> -->
			<vue-nav :cur="cur" :all="all" :allcount="allcount" :callback="callback"></vue-nav>




		</div>
	</div>
	<!--tablebox end-->

	<!--pagination start-->


	<!--pagination end-->

</body>
<script type="text/javascript" src="/static/js/jquery.js"></script>
<script type="text/javascript" src="/static/js/common.js"></script>

<script src="/static/js/layer/layer.js"></script>

<script type="text/javascript" src="/static/js/vue2.js"></script>
<script type="text/javascript" src="/static/js/vue-nav.js"></script>
<script src="/static/My97DatePicker/WdatePicker.js"></script>
<script>
	var menu = new Vue({
		el: '#classid',
		data: {
			classid: "{$classid}",
			list: []
		},
		methods: {
			getdata: function () {
				var _self = this;//保存this的指向

				$.get('/Index/Myclass/GetMyClassList', function (data) {
					_self.list = data;
				});
			}

		},
		created: function () {  //初始化事件里边去调用查询方法
			this.getdata();
		}
	});
	var vm = new Vue({
		el: "#main",
		data: {
			cur: 1,
			all: 0,
			size: 20,
			allcount: 0,
			arrayData: [],

		},
		components: {
			'vue-nav': Vnav
		},
		methods: {
			getdata: function (_keycontent) {  //查询数据

				var self = this;
				var number = $("#number").val();
				var truename = $("#truename").val();
				var classid = $("#classid").val();
				var date1 = $("#date1").val();
				var date2 = $("#date2").val();

				$.get("/Index/daily/getSign", { page: self.cur, size: self.size, number: number, truename: truename, classid: classid, date1: date1, date2: date2 }, function (_result) {
					self.arrayData = _result.list;
					self.all = _result.count;
					self.allcount = _result.allcount
				});

			},
			callback: function (data) {

				var self = this;
				this.cur = data;
				var number = $("#number").val();
				var truename = $("#truename").val();
				var classid = $("#classid").val();
				var date1 = $("#date1").val();
				var date2 = $("#date2").val();
				$.get("/Index/daily/getSign", { page: self.cur, size: self.size, number: number, truename: truename, classid: classid, date1: date1, date2: date2 }, function (_result) {

					self.arrayData = _result.list;
					self.all = _result.count;
					self.allcount = _result.allcount
				});
			}
		},
		created: function () {  //初始化事件里边去调用查询方法
			this.getdata("");
		}
	});

	$("#search").click(function () {

		vm.getdata("");
	});
	$("#clear").click(function () {
		$("#number").val("");
		$("#truename").val("");
		$("#classid").val("");
		$("#date1").val("");
		$("#date2").val("");

	});
</script>

</html>